<!--
 * @Description: 预调整
 * @Author: wind-lc
 * @version: 1.0
 * @Date: 2021-12-29 17:29:14
 * @LastEditTime: 2023-07-13 09:45:05
 * @FilePath: \cscec-pms-admin\src\views\construction\constructionScheduleAdjust\components\PresetAdjust.vue
-->
<template>
  <div>
    <div class="btn-wrapper">
      <template v-if="!isAudit">
        <!-- <a-button
          type="primary"
          :disabled="notSelectRow || selectRow.nodeType===1 || isDetail || isOperation"
        >
          导入Project
        </a-button>
        <a-button
          type="primary"
          :disabled="notSelectRow || selectRow.nodeType===1 || isDetail || isOperation"
        >
          导出Project
        </a-button> -->
        <a-button
          type="primary"
          :disabled="notSelectRow || selectRow.nodeType===1 || isDetail || isOperation"
          @click="handleCreateSiblingWorkPack"
        >
          新增同级阶段/类别
        </a-button>
        <a-button
          type="primary"
          :disabled="notSelectRow || selectRow.nodeType === 1 || isDetail || isOperation"
          @click="handleCreateWorkPack"
        >
          新增下级阶段/类别
        </a-button>
        <a-button
          type="primary"
          :disabled="notSelectRow || isDetail || isOperation"
          @click="handleCreateWork"
        >
          新增业务事项
        </a-button>
        <a-button
          type="primary"
          :disabled="notSelectRow || selectRow.nodeOrder === 0 || selectRow.nodeOrder === 2 || selectRow.notDeleteOrUpdate || isDetail || isOperation"
          @click="handleMoveUp"
        >
          上移
        </a-button>
        <a-button
          type="primary"
          :disabled="notSelectRow || selectRow.nodeOrder === 1 || selectRow.nodeOrder === 2 || selectRow.notDeleteOrUpdate || isDetail || isOperation"
          @click="handleMoveDown"
        >
          下移
        </a-button>
        <!-- <a-button
          type="primary"
          :disabled="notSelectRow || selectRow.level === 1 || selectRow.nodeType === 1 || selectRow.notDeleteOrUpdate || isDetail || isOperation"
          @click="handleUpgradeWorkPack"
        >
          升级
        </a-button>
        <a-button
          type="primary"
          :disabled="notSelectRow || selectRow.nodeOrder === 0 || selectRow.nodeOrder === 2 || selectRow.nodeType === 1 || selectRow.notDeleteOrUpdate || isDetail || isOperation"
          @click="handleDowngradeWorkPack"
        >
          降级
        </a-button> -->
        <a-button
          type="primary"
          :disabled="notSelectRow || isDetail || isOperation || selectRow.notDeleteOrUpdate"
          @click="handleOperation('edit')"
        >
          信息调整
        </a-button>
        <a-button
          type="primary"
          :disabled="notSelectRow || isDetail || selectRow.isRootOneNode || isOperation ||selectRow.nodeStatus === 2 || selectRow.nodeStatus === 4 || selectRow.nodeStatus === 5"
          @click="handleOperation('delete')"
        >
          删除
        </a-button>
      </template>
      <a-button
        :disabled="isOperation"
        type="primary"
        @click="ganttVisible = true"
      >
        查看甘特图
      </a-button>
      <a-button
        :disabled="isOperation"
        type="primary"
        @click="$refs.table.setAllTreeExpansion()"
      >
        展开全部
      </a-button>
      <a-button
        :disabled="isOperation"
        type="primary"
        @click="$refs.table.clearTreeExpand()"
      >
        收起全部
      </a-button>
      <a-button
        type="primary"
        :disabled="loading"
        @click="handleRefresh"
      >
        手动刷新
      </a-button>
    </div>
    <div class="pub-table-select-count">
      <a-icon
        type="info-circle"
        theme="twoTone"
      />
      <span>
        项目：
        <span class="totalNum">{{ tableInfo.projectName }}</span>
      </span>
      <span>
        预调整节点共
        <span class="totalNum">{{ tableInfo.adjustTotalNodeNum }}</span> 项
      </span>
      <span>
        预调整一级节点共
        <span
          class="totalNum"
          @click="handleNodeInfo(1)"
        >{{ tableInfo.firstAdjustNodeNum }}</span> 项
      </span>
      <span>
        预调整二级节点共
        <span
          class="totalNum"
          @click="handleNodeInfo(2)"
        >{{ tableInfo.secondAdjustNodeNum }}</span> 项
      </span>
      <span>
        预调整三级节点共
        <span
          class="totalNum"
          @click="handleNodeInfo(3)"
        >{{ tableInfo.threeAdjustNodeNum }}</span> 项
      </span>
    </div>
    <u-table
      ref="table"
      fixed-columns-roll
      :height="500"
      show-header-overflow
      :tree-config="{
        children: 'childTree',
        expandAll: false,
      }"
      row-id="id"
      row-key="id"
      :use-virtual="true"
      :current-row-key="currentRowKey"
      border
      class="construction-schedule-view-table"
      @row-click="handleRowClick"
    >
      <u-table-column
        v-for="item in columns1"
        :key="item.dataIndex"
        :prop="item.dataIndex"
        :label="item.title"
        :width="item.width"
        :tree-node="item.dataIndex === 'phaseCategory'"
        align="center"
      >
        <template v-slot="{ row }">
          <!-- 编辑 -->
          <span
            v-if="row.operation === 'edit'"
            :title="item.dataIndex === 'directResPerList' && row.nodeType ===1?row[item.dataIndex].map(el=>el.label).join(','):row[item.dataIndex]"
          >
            <!-- 阶段/类别类型 -->
            <span
              v-if="row.nodeType === 0"
              class="span-ellipsis"
            >
              <!-- 序号 -->
              <span v-if="item.dataIndex === 'sortNum'">
                <img
                  v-if="row.flag"
                  :src="flag"
                  width="20"
                  hight="20"
                >
                <span>{{ row[item.dataIndex] }}</span>
              </span>
              <!-- 序号 -->
              <!-- 阶段类别 -->
              <BaseInput
                v-if="item.dataIndex === 'phaseCategory'"
                v-model="row.phaseCategory"
                :placeholder="'请输入'+item.title"
              />
              <!-- 阶段类别 -->
              <span v-if="['businessMatters','period','planStartTime','planEndTime','adjustCase'].includes(item.dataIndex)">
                {{ row[item.dataIndex] }}
              </span>
            </span>
            <!-- 阶段/类别类型 -->
            <!-- 业务事项类型 -->
            <template v-else>
              <!-- 序号 -->
              <span
                v-if="item.dataIndex === 'sortNum'"
                :class="'class-'+row.statusLights"
                class="sort-num"
              >
                <img
                  v-if="row.flag"
                  :src="flag"
                  width="20"
                  hight="20"
                >
                <img
                  v-if="row.promptLights === 1 || row.promptLights === 2"
                  :src="row.promptLights === 1 ? yellowLight : redLight"
                  width="20"
                  hight="20"
                >
                <span>{{ row[item.dataIndex] }}</span>
              </span>
              <!-- 序号 -->
              <!-- 业务事项 -->
              <span v-if="item.dataIndex === 'businessMatters'">
                <BaseInput
                  v-if="row.nodeStatus !== 2 && row.nodeStatus !== 4 && row.nodeStatus !== 5 && row.nodeStatus !== 6"
                  v-model="row.businessMatters"
                  :placeholder="'请输入'+item.title"
                />
                <span v-else>{{row.businessMatters}}</span>
              </span>

              <!-- 业务事项 -->
              <!-- 管控级别 -->
              <span v-if="item.dataIndex === 'controlLevelId'">
                <a-select
                  v-if="row.nodeStatus !== 2 && row.nodeStatus !== 4 && row.nodeStatus !== 5 && row.nodeStatus !== 6"
                  v-model="row.controlLevelId"
                  :placeholder="'请选择'+item.title"
                  class="width-100"
                >
                  <a-select-option
                    v-for="{value,label} in controlLevelList"
                    :key="value"
                    :value="value"
                  >
                    {{ label }}
                  </a-select-option>
                </a-select>
                <span v-else>{{row.controlLevelName}}</span>
              </span>
              <!-- 管控级别 -->
              <!-- 周期(天) -->
              <span v-if="item.dataIndex === 'period'">
                <BaseInputNumber
                  v-if="row.nodeStatus !== 2 && row.nodeStatus !== 4 && row.nodeStatus !== 5 && row.nodeStatus !== 6"
                  v-model="row.period"
                  :placeholder="'请输入'+item.title"
                  :min="1"
                  :max="2000"
                  :is-int="true"
                  @blur="(e)=>{handleComputePeriod(e.target._value,row,0)}"
                />
                <span v-else>{{row.period}}</span>
              </span>
              <!-- 周期(天) -->
              <!-- 计划开始时间 -->
              <span v-if="item.dataIndex === 'planStartTime'">
                <a-date-picker
                  v-if="row.nodeStatus !== 2 && row.nodeStatus !== 4 && row.nodeStatus !== 5 && row.nodeStatus !== 6"
                  v-model="row.planStartTime"
                  :allow-clear="false"
                  :placeholder="'请输入，如2023-01-01'"
                  :open="row.planStartTimeOpen"
                  :disabled-date="(current)=>{return planStartTimeDisabled(current,row)}"
                  @openChange="(e)=>{row.planStartTimeOpen = e}"
                  @change="(e)=>{handleComputePeriod(e,row,1)}"
                />
                <span v-else>{{row.planStartTime}}</span>
              </span>
              <!-- 计划开始时间 -->
              <!-- 计划完成时间 -->
              <span v-if="item.dataIndex === 'planEndTime'">
                <a-date-picker
                  v-if="row.nodeStatus !== 2 && row.nodeStatus !== 4 && row.nodeStatus !== 5 && row.nodeStatus !== 6"
                  v-model="row.planEndTime"
                  :allow-clear="false"
                  :placeholder="'请输入，如2023-01-01'"
                  :disabled-date="(current)=>{return planEndTimeDisabled(current,row)}"
                  :open="row.planEndTimeOpen"
                  @change="(e)=>{handleComputePeriod(e,row,2)}"
                  @openChange="(e)=>{row.planEndTimeOpen = e}"
                />
                <span v-else>{{ row.planEndTime }}</span>
              </span>
              <!-- 计划完成时间 -->
              <!-- 实际完成时间 -->
              <span
                v-if="item.dataIndex === 'completeTime'"
                class="span-ellipsis"
              >
                {{ row[item.dataIndex] }}
              </span>
              <!-- 实际完成时间 -->
              <!-- 前置任务 -->
              <span
                v-if="item.dataIndex === 'frontTask'"
                class="span-ellipsis"
              >
                {{ row[item.dataIndex] }}
              </span>
              <!-- 前置任务 -->
              <!-- 间隔时间 -->
              <span
                v-if="item.dataIndex === 'intervalTime'"
                class="span-ellipsis"
              >
                {{ row[item.dataIndex] }}
              </span>
              <!-- 间隔时间 -->
              <!-- 完成标准 -->
              <span v-if="item.dataIndex === 'completeStandard'">
                <a-auto-complete
                  v-if="row.nodeStatus !== 2 && row.nodeStatus !== 4 && row.nodeStatus !== 5 && row.nodeStatus !== 6"
                  v-model="row.completeStandard"
                  :placeholder="'请选择'+item.title"
                  :data-source="completeStandardList"
                  class="width-100"
                  allow-clear
                  :filter-option="true"
                  @change="handleCompleteStandard($event,row)"
                />
                <span v-else>{{row.completeStandard}}</span>
              </span>
              <!-- 完成标准 -->
              <!-- 验证资料 -->
              <span v-if="item.dataIndex === 'verifyFiles'">
                <BaseInput
                  v-if="row.nodeStatus !== 2 && row.nodeStatus !== 4 && row.nodeStatus !== 5 && row.nodeStatus !== 6"
                  v-model="row.verifyFiles"
                  :placeholder="'请输入'+item.title"
                />
                <span v-else>{{row.verifyFiles}}</span>
              </span>
              <!-- 验证资料 -->
              <!-- 第一责任人 -->
              <span
                v-if="item.dataIndex === 'firstResName'"
                class="span-btn-ellipsis"
              >
                <span
                  v-show="row.firstResName"
                  class="span-btn-ellipsis-text"
                >
                  {{ row[item.dataIndex] }}
                </span>
                <a
                  v-if="row.nodeStatus !== 2 && row.nodeStatus !== 4 && row.nodeStatus !== 5 && row.nodeStatus !== 6"
                  class="span-btn-ellipsis-btn"
                  @click="handleFirstResNameSelect(row)"
                > {{ row.firstResName?'(重新选择)':'选择岗位' }} </a>
              </span>
              <!-- 第一责任人 -->
              <!-- 直接责任人 -->
              <div
                v-if="item.dataIndex === 'directResPerList'"
                class="span-btn-ellipsis"
              >
                <span
                  v-show="row.directResPerList && row.directResPerList.length>0 && !row.showSelect"
                  class="span-btn-ellipsis-text"
                >
                  {{ row[item.dataIndex].map(el=>el.label).join(',') }}
                </span>
                <a-select
                  v-show="row.showSelect"
                  :ref="'directSelect-' + row.sortNum"
                  v-model="row.directResPerList"
                  :placeholder="'请选择'+item.title"
                  label-in-value
                  mode="multiple"
                  class="span-btn-ellipsis-text"
                  @dropdownVisibleChange="dropdownVisibleChange($event, row)"
                  @change="((value)=>{handleDirectResPerList(value,row)})"
                >
                  <a-select-option
                    v-for="{employeeId,name,phone} in directlyDutyPersonList"
                    :key="employeeId"
                    :value="employeeId"
                    :data="{directResPerName:name}"
                  >
                    <a-tooltip :placement="'topLeft'">
                      <template slot="title">
                        {{ phone }}
                      </template>
                      {{ name }}
                    </a-tooltip>
                  </a-select-option>
                </a-select>
                <a
                  v-if="row.nodeStatus !== 2 && row.nodeStatus !== 4 && row.nodeStatus !== 5 && row.nodeStatus !== 6"
                  class="span-btn-ellipsis-btn"
                  @click="handleDirectResPerSelect(row,true)"
                >(点击选择)</a>
              </div>
              <!-- 直接责任人 -->
              <!-- 是否关键线路节点--是否垂直运输设备装拆 -->
              <a-switch
                v-else-if="['isKeyNode','isMilestonesNode','isMainProcessNode','isVerticalTransportNode'].includes(item.dataIndex)"
                v-model="row[item.dataIndex]"
                checked-children="是"
                un-checked-children="否"
              />
              <!-- 是否关键线路节点--是否垂直运输设备装拆 -->
              <!-- :disabled="[2,4,5,6].includes(row.nodeStatus)" -->
              <a-switch
                v-else-if="item.dataIndex === 'isContractDurationNode'"
                v-model="row[item.dataIndex]"
                checked-children="是"
                un-checked-children="否"
                @change="isContractDurationNodeChange($event,row)"
              />
              <!-- 节点状态 -->
              <span
                v-if="item.dataIndex === 'nodeStatusName'"
                class="span-ellipsis"
              >
                {{ row[item.dataIndex] }}
              </span>
              <!-- 节点状态 -->
              <!-- 调整情况 -->
              <span
                v-if="item.dataIndex === 'adjustCase'"
                class="span-ellipsis"
              >
                {{ row[item.dataIndex] }}
              </span>
              <!-- 调整情况 -->
              <!-- 合同开始时间 -->
              <span v-if="item.dataIndex === 'contractStartDate'">
                <!-- v-if="row.nodeStatus !== 2 && row.nodeStatus !== 4 && row.nodeStatus !== 5 && row.nodeStatus !== 6" -->
                <a-date-picker
                  v-model="row.contractStartDate"
                  :allow-clear="false"
                  :placeholder="'请输入，如2023-01-01'"
                  :disabled="!row.isContractDurationNode"
                  :open="row.contractStartDateOpen"
                  @openChange="(e)=>{row.contractStartDateOpen = e}"
                  @change="(e)=>{handleComputePeriod(e,row,3)}"
                />
                <!-- <span>{{ row.contractStartDate }}</span> -->
              </span>
              <!-- 合同开始时间 -->
              <!-- 合同完成时间 -->
              <span v-if="item.dataIndex === 'contractEndDate'">
                <!-- v-if="row.nodeStatus !== 2 && row.nodeStatus !== 4 && row.nodeStatus !== 5 && row.nodeStatus !== 6" -->
                <a-date-picker
                  v-model="row.contractEndDate"
                  :allow-clear="false"
                  :placeholder="'请输入，如2023-01-01'"
                  :disabled="!row.isContractDurationNode"
                  :open="row.contractEndDateOpen"
                  :disabled-date="(current)=>{return contractEndDateDisabled(current,row)}"
                  @openChange="(e)=>{row.contractEndDateOpen = e}"
                  @change="(e)=>{handleComputePeriod(e,row,4)}"
                />
                <!-- <span v-else>{{ row.contractEndDate }}</span> -->
              </span>
              <!-- 合同开始时间 -->
            </template>
            <!-- 业务事项类型 -->
          </span>
          <!-- 编辑 -->
          <!-- 查看 -->
          <span
            v-else
            :title="row[item.dataIndex]"
            class="span-ellipsis"
          >
            <template v-if="row.nodeType === 0">
              <span
                v-if="item.dataIndex === 'sortNum'"
                class="sort-num class-0"
              >
                <img
                  v-if="row.flag"
                  :src="flag"
                  width="20"
                  hight="20"
                >
                <span>{{ row[item.dataIndex] }}</span>
              </span>
              <template v-if="['phaseCategory','businessMatters','period','planStartTime','planEndTime','adjustCase','contractStartDate','contractEndDate'].includes(item.dataIndex)">
                {{ row[item.dataIndex] }}
              </template>
            </template>
            <template v-else>
              <!-- 序号 -->
              <span
                v-if="item.dataIndex === 'sortNum'"
                :class="'class-'+row.statusLights"
                class="sort-num"
              >
                <img
                  v-if="row.flag"
                  :src="flag"
                  width="20"
                  hight="20"
                >
                <img
                  v-if="row.promptLights === 1 || row.promptLights === 2"
                  :src="row.promptLights === 1 ? yellowLight : redLight"
                  width="20"
                  hight="20"
                >
                <span>{{ row[item.dataIndex] }}</span>
              </span>
              <!-- 序号 -->
              <!-- 计划开始时间/计划完成时间-->
              <span v-else-if="item.dataIndex === 'planStartTime' || item.dataIndex === 'planEndTime'">
                {{ formatDate( row[item.dataIndex],false) }}
              </span>
              <!-- 计划开始时间/计划完成时间 -->
              <!-- 前置任务 -->
              <a
                v-else-if="item.dataIndex === 'frontTask'"
                class="span-ellipsis"
                @click="function(){if(!isDetail && row.isSetFront && useSetFront && selectRow.nodeStatus !== 2 && selectRow.nodeStatus !== 4 && selectRow.nodeStatus !== 5){handlePredecessorTask()}}"
              >
                <template v-if="!isDetail && !row.frontTask && row.isSetFront && selectRow.nodeStatus !== 2 && selectRow.nodeStatus !== 4 && selectRow.nodeStatus !== 5">
                  设置
                </template>
                <template v-else>
                  {{ row[item.dataIndex] }}
                </template>
              </a>
              <!-- 前置任务 -->
              <template v-else-if="item.dataIndex === 'controlLevelId'">
                {{ row.controlLevelName }}
              </template>
              <template v-else-if="item.dataIndex === 'directResPerList'">
                {{ row[item.dataIndex].map(el=>el.label).join(',') }}
              </template>
              <a-switch
                v-else-if="['isKeyNode','isMilestonesNode','isMainProcessNode','isVerticalTransportNode','isContractDurationNode'].includes(item.dataIndex)"
                v-model="row[item.dataIndex]"
                checked-children="是"
                un-checked-children="否"
                disabled
              />
              <template v-else>
                {{ row[item.dataIndex] }}
              </template>
            </template>
          </span>
          <!-- 查看 -->
        </template>
      </u-table-column>
      <u-table-column
        key="operation"
        label="操作"
        width="170"
        align="center"
        fixed="right"
      >
        <template v-slot="{ row }">
          <!-- :key="row.id"避免插槽数据更新不及时 -->
          <MoreButton :key="row.id + new Date().getTime()">
            <a
              v-if="row.adjustOpt === 'MODIFY' && row.operation !== 'edit' && row.operation !== 'delete'"
              @click="handleHistory(row)"
            >历史调整信息</a>
            <a
              v-if="row.operation === 'edit' && row.adjustOpt === 'ADD'"
              @click="handleConfirm(row)"
            >确认</a>
            <a
              v-if="row.operation === 'edit' && row.adjustOpt !== 'ADD'"
              @click="handleAdjust(row)"
            >确认调整</a>
            <a
              v-if="row.operation === 'delete'"
              @click="handleRemove(row)"
            >确认删除</a>
            <a
              v-if="row.operation === 'edit' || row.operation === 'delete'"
              @click="handleCancel(row)"
            >取消</a>
          </MoreButton>
        </template>
      </u-table-column>
    </u-table>
    <!-- 甘特图 -->
    <GanttModal
      :visible.sync="ganttVisible"
      :data="ganttData"
    />
    <!-- 甘特图 -->
    <!-- 设置前置任务 -->
    <PredecessorTask
      :visible.sync="predecessorTaskVisible"
      :record="selectRow"
      :api="api"
    />
    <!-- 设置前置任务 -->
    <!-- 选择第一责任人 -->
    <modal
      v-if="firstResNameVisible"
      :id="firstResNameData.id"
      :form-data="firstResNameData.formData"
      :org-query="firstResNameData.orgQuery"
      :screening="true"
      :visible="true"
      @handleCancelFirstRes="firstResNameVisible = false"
      @handleOk="handleFirstResName"
    />
    <!-- 选择第一责任人 -->
    <!-- 历史调整信息 -->
    <HistoryAdjust
      :visible.sync="historyAdjustVisible"
      :data="historyAdjustData"
      :is-audit="isAudit"
    />
    <!-- 历史调整信息 -->
  </div>
</template>
<script>
import { getProjects } from '@/api/construction/planInput'
import { columns1, controlLevelList, completeStandardList, verifyFilesList } from '../model.js'
import { UTable, UTableColumn } from 'umy-ui'
import GanttModal from '@/components/GanttModal'
import { view } from '@/api/construction/constructionScheduleAdjust'
import PredecessorTask from '../../constructionSchedule/components/PredecessorTask'
import modal from '@/components/SelectJobs'
import Vue from 'vue'
import constructionSchedule from '@/api/construction/constructionSchedule'
import HistoryAdjust from './HistoryAdjust'
// import MoreButton from '@/components/MoreButton'
export default {
  name: 'PresetAdjust',
  props: {
    isAudit: {
      // 是否作为审批详情
      type: Boolean,
      default: false
    },
    // 加载
    loading: {
      type: Boolean,
      require: true
    }
  },
  components: {
    UTable,
    UTableColumn,
    GanttModal,
    PredecessorTask,
    modal,
    HistoryAdjust
    // MoreButton
  },
  data() {
    return {
      // 前置接口
      api: view,
      // 选中项
      selectRow: {},
      // 表格信息
      tableInfo: {
        projectName: void 0,
        adjustTotalNodeNum: void 0,
        firstAdjustNodeNum: void 0,
        secondAdjustNodeNum: void 0,
        threeAdjustNodeNum: void 0,
        projectId: void 0
      },
      // 表头
      columns1,
      // 甘特图显示隐藏
      ganttVisible: false,
      // 甘特图数据
      ganttData: {
        list: [],
        lines: [],
        startDate: '',
        endDate: ''
      },
      // 表格数据
      tableData: [],
      // 旗帜
      flag: require('@/assets/blueFlag.png'),
      // 红灯
      redLight: require('@/assets/icons/redLight.png'),
      // 黄灯
      yellowLight: require('@/assets/icons/yellowLight.png'),
      // 高亮行id
      currentRowKey: '',
      // 管控级别列表
      controlLevelList,
      // 前置任务显示隐藏
      predecessorTaskVisible: false,
      // 完成标准
      completeStandardList,
      // 第一责任人模态框显示隐藏
      firstResNameVisible: false,
      // 第一责任人模态框数据
      firstResNameData: {
        id: '',
        formData: {
          fileList: []
        },
        orgQuery: {},
        row: {}
      },
      // 直接责任人列表
      directlyDutyPersonList: [],
      // 验证资料
      verifyFilesList,
      // 必填字段
      dataIndex: [
        ['phaseCategory'],
        [
          'businessMatters',
          'controlLevelId',
          'period',
          'planStartTime',
          'planEndTime',
          // 'completeDate',
          // 'frontTask',
          // 'intervalTime',
          'completeStandard',
          'verifyFiles',
          'firstResName',
          'directResPerList',
          'isKeyNode',
          'isMilestonesNode',
          'isMainProcessNode',
          'isVerticalTransportNode',
          'isContractDurationNode',
          'contractStartDate',
          'contractEndDate'
        ]
      ],
      // 历史调整信息隐藏显示
      historyAdjustVisible: false,
      // 历史调整信息数据
      historyAdjustData: {},
      // 开启设置前置任务
      useSetFront: true
    }
  },
  computed: {
    // 没有选中
    notSelectRow() {
      return JSON.stringify(this.selectRow) === '{}'
    },
    // 是查看
    isDetail() {
      return this.$route.query.pageType === 'detail' || this.isAudit
    },
    // 在调整或者删除状态
    isOperation() {
      return this.selectRow?.operation === 'edit' || this.selectRow?.operation === 'delete'
    },
    // 调整id
    adjustId() {
      return this.$route.query.id ?? ''
    }
  },
  watch: {
    // 第一责任人模态框关闭
    predecessorTaskVisible: {
      handler(newV, oldV) {
        if (!newV) {
          this.loadData()
        }
      }
    },
    // 表格数据监听
    tableData: {
      async handler(list) {
        this.currentRowKey = ''
        if (this.$refs.table) {
          this.$emit('update:loading', true)
          const eachTree = (list) => {
            for (let i = 0; i < list.length; i++) {
              // 初始化时间弹层隐藏显示(解决时间输入识别后不能自动关闭)
              list[i].planStartTimeOpen = false
              list[i].planEndTimeOpen = false
              list[i].contractStartDateOpen = false
              list[i].contractEndDateOpen = false
              if (list[i].childTree) {
                eachTree(list[i].childTree)
              }
            }
          }
          eachTree(this.tableData)
          // 获取之前展开数据
          const expandRecords = this.$refs.table.getTreeExpandRecords()
          // 获取之前滚动高度(表格实例上的scrollTop属性，在滚动到底部时会小于真实的scrollTop值，因此直接从dom获取真实滚动高度)
          const scrollTop = this.$refs.table.tableExample().bodyWrapper.scrollTop
          const scrollLeft = this.$refs.table.tableExample().bodyWrapper.scrollLeft
          // 加载数据
          await this.$refs.table.reloadData(list).then(() => {
            // 数据加载完成出现之后，打开之前的展开行
            expandRecords.forEach((row) => {
              this.$refs.table.setTreeExpansion(row, true)
            })
            // 还原之前滚动高度
            this.$refs.table.pagingScrollTopLeft(scrollTop + 1, scrollLeft)
            this.$nextTick(()=>{
              // 不加这一步，列表操作栏 会变形
              this.$refs.table.pagingScrollTopLeft(scrollTop, scrollLeft)
            })
          })
          this.currentRowKey = this.selectRow.id
          // 扁平化树为甘特图数据
          let arr = []
          let lines = []
          const flatTree = (list) => {
            for (let i = 0; i < list.length; i++) {
              const obj = this.$clone(list[i])
              delete obj.childTree
              const { id: taskId, planStartTime: startDate, planEndTime: endDate, businessMatters, phaseCategory, statusLights, isKeyNode, nodeType } = obj
              const text = nodeType === 1 ? businessMatters : phaseCategory
              if (list[i].childTree) {
                flatTree(list[i].childTree)
              } else {
                obj.phaseCategory = text
                if (obj.frontConnectList && obj.frontConnectList.length > 0) {
                  lines = lines.concat(obj.frontConnectList)
                }
              }
              let color = ''
              const c = {
                0: 'class-slider-0',
                1: 'class-slider-1',
                2: 'class-slider-2',
                3: 'class-slider-3',
                4: 'class-slider-4'
              }
              // 甘特图颜色
              if (isKeyNode) {
                color = 'class-slider-key'
              } else {
                color = c[statusLights]
              }
              arr.push({
                taskId,
                startDate,
                endDate,
                class: color,
                text,
                ...obj
              })
            }
          }
          flatTree(this.tableData)
          this.ganttData.list = arr.sort((a, b) => a.sortNum - b.sortNum)
          this.ganttData.lines = lines
          this.$emit('update:loading', false)
        }
      },
      deep: true
    }
  },
  methods: {
    /**
     * @description: 表格行点击
     * @param {object} row 行数据
     * @param {object} column 表头对象
     * @param {event} event 事件对象
     * @return {void}
     */
    handleRowClick(row, column, event) {
      console.log('row', row)
      if (this.selectRow?.id !== row.id) {
        // 业务事项
        if (row.nodeType === 1) {
          this.getDirectlyDutyPerson(row)
        }
        // 改变选中项
        if (this.selectRow?.operation === 'edit') {
          // 当前已经有项正在编辑中
          this.currentRowKey = ''
          const timer = setTimeout(() => {
            this.currentRowKey = this.selectRow.id
            clearTimeout(timer)
          })
          this.$message.warning('请先保存当前预调整')
        } else if (this.selectRow?.operation === 'delete') {
          // 当前已经有项在删除中
          this.currentRowKey = ''
          const timer = setTimeout(() => {
            this.currentRowKey = this.selectRow.id
            clearTimeout(timer)
          })
          this.$message.warning('请先确认删除当前调整')
        } else {
          // 设置第一责任人信息
          this.firstResNameData.row.firstResId = row.firstResId
          this.firstResNameData.row.firstResName = row.firstResName
          // 可以改变
          this.$set(this, 'selectRow', this.$clone(row))
        }
      }
    },
    /**
     * @description: 获取直接责任人
     * @param {object} row 行数据
     * @return {void}
     */
    getDirectlyDutyPerson(row) {
      constructionSchedule.directlyDutyPersonSelectQuery({ nodeId: row.id, projectId: this.tableInfo.projectId }).then(({ code, data }) => {
        if (code === 200) {
          this.directlyDutyPersonList = data
        } else {
          this.directlyDutyPersonList = []
        }
      })
    },
    /**
     * @description: 表格数据加载方法
     * @param {boolean} isFirst 是否需要加载前置数据
     * @return {Promise} 接口Promise
     */
    async loadData(isFirst = false) {
      this.$emit('update:loading', true)
      try {
        const {
          code,
          data: { projectName, adjustTotalNodeNum, firstAdjustNodeNum, secondAdjustNodeNum, threeAdjustNodeNum, planStartTime, planEndTime, treeListVO, projectId }
        } = await view.planAdjustDetail(this.adjustId)
        if (code === 200) {
          this.tableInfo = {
            projectName,
            adjustTotalNodeNum,
            firstAdjustNodeNum,
            secondAdjustNodeNum,
            threeAdjustNodeNum,
            projectId
          }
          this.tableData = treeListVO
          this.ganttData.startDate = planStartTime
          this.ganttData.endDate = planEndTime
          // 设置第一责任人信息
          if (isFirst) {
            // 获取前置数据
            const orgInfo = await getProjects({ projectIds: [this.tableInfo.projectId] })
            this.firstResNameData.orgQuery.ids = orgInfo.data[0].orgId
            const userInfo = Vue.getAcloudProvider().getUserInfo()
            this.firstResNameData.id = userInfo.id
          }
        } else {
          this.tableData = []
        }
      } catch (error) {
        console.log(error)
      } finally {
        this.$emit('update:loading', false)
      }
    },
    /**
     * @description: 新增同级阶段/类别
     * @param {void}
     * @return {void}
     */
    handleCreateSiblingWorkPack() {
      const vm = this
      this.$confirm({
        okText: '确定',
        cancelText: '取消',
        title: '确定新增同级阶段/类别?',
        onOk() {
          view.createSiblingWorkPack({ selectedWorkPackId: vm.selectRow.id }).then(({ code }) => {
            if (code === 200) {
              vm.$message.success('新增成功')
              vm.loadData()
            }
          })
        }
      })
    },
    /**
     * @description: 新增下级阶段/类别
     * @param {void}
     * @return {void}
     */
    handleCreateWorkPack() {
      const vm = this
      this.$confirm({
        okText: '确定',
        cancelText: '取消',
        title: '确定新增下级阶段/类别?',
        onOk() {
          vm.$emit('update:loading', true)
          view
            .createChildWorkPack({ selectedWorkPackId: vm.selectRow.id })
            .then(({ code }) => {
              if (code === 200) {
                vm.$message.success('新增成功')
                vm.loadData()
              }
            })
            .finally(() => {
              vm.$emit('update:loading', false)
            })
        }
      })
    },
    /**
     * @description: 新增业务事项
     * @param {void}
     * @return {void}
     */
    handleCreateWork() {
      const vm = this
      this.$confirm({
        okText: '确定',
        cancelText: '取消',
        title: '确定新增业务事项?',
        onOk() {
          vm.$emit('update:loading', true)
          if (vm.selectRow.nodeType === 1) {
            // 新增同级业务事项
            view
              .siblingWork({ selectedWorkId: vm.selectRow.id })
              .then(({ code }) => {
                if (code === 200) {
                  vm.$message.success('新增成功')
                  vm.loadData()
                }
              })
              .finally(() => {
                vm.$emit('update:loading', false)
              })
          } else {
            // 新增下级业务事项
            view
              .createChildWork({ selectedWorkPackId: vm.selectRow.id })
              .then(({ code }) => {
                if (code === 200) {
                  vm.$message.success('新增成功')
                  vm.loadData()
                }
              })
              .finally(() => {
                vm.$emit('update:loading', false)
              })
          }
        }
      })
    },
    /**
     * @description: 上移
     * @param {void}
     * @return {void}
     */
    handleMoveUp() {
      this.$emit('update:loading', true)
      view
        .moveUp({ selectedId: this.selectRow.id })
        .then(({ code }) => {
          if (code === 200) {
            this.$message.success('上移成功')
            this.loadData()
          }
        })
        .finally(() => {
          this.$emit('update:loading', false)
        })
    },
    /**
     * @description: 下移
     * @param {void}
     * @return {void}
     */
    handleMoveDown() {
      this.$emit('update:loading', true)
      view
        .moveDown({ selectedId: this.selectRow.id })
        .then(({ code }) => {
          if (code === 200) {
            this.$message.success('下移成功')
            this.loadData()
          }
        })
        .finally(() => {
          this.$emit('update:loading', false)
        })
    },
    // /**
    //  * @description: 升级
    //  * @param {void}
    //  * @return {void}
    //  */
    // handleUpgradeWorkPack() {
    //   this.$emit('update:loading', true)
    //   view
    //     .upgradeWorkPack({ selectedWorkPackId: this.selectRow.id })
    //     .then(({ code }) => {
    //       if (code === 200) {
    //         this.$message.success('升级成功')
    //         this.loadData()
    //       }
    //     })
    //     .finally(() => {
    //       this.$emit('update:loading', false)
    //     })
    // },
    // /**
    //  * @description: 降级
    //  * @param {void}
    //  * @return {void}
    //  */
    // handleDowngradeWorkPack() {
    //   this.$emit('update:loading', true)
    //   view
    //     .downgradeWorkPack({ selectedWorkPackId: this.selectRow.id })
    //     .then(({ code }) => {
    //       if (code === 200) {
    //         this.$message.success('降级成功')
    //         this.loadData()
    //       }
    //     })
    //     .finally(() => {
    //       this.$emit('update:loading', false)
    //     })
    // },
    /**
     * @description: 格式化时间
     * @param {object/string} date 时间对象或字符串
     * @param {boolean} toMoment 是否转换为Moment
     * @return {object} moment时间格式
     */
    formatDate(date, toMoment = true) {
      if (date?._isAMomentObject) {
        return toMoment ? date : date.format('YYYY-MM-DD')
      } else {
        return toMoment ? this.moment(date) : date
      }
    },
    /**
     * @description: 计划开始时间禁用
     * @param {object} current 当前时间对象
     * @param {object} row 行数据
     * @return {boolean}
     */
    planStartTimeDisabled(current, row) {
      return row.planEndTime && current && current > this.moment(row.planEndTime).endOf('day')
    },
    /**
     * @description: 计划完成时间禁用
     * @param {object} current 当前时间对象
     * @param {object} row 行数据
     * @return {boolean}
     */
    planEndTimeDisabled(current, row) {
      return row.planStartTime && current && current < this.moment(row.planStartTime).startOf('day')
    },
    /**
     * @description: 合同完成时间禁用
     * @param {object} current 当前时间对象
     * @param {object} row 行数据
     * @return {boolean}
     */
    contractEndDateDisabled(current, row) {
      return row.planEndTime ? current && current < this.moment(row.planEndTime).startOf('day') - 1 : true
    },
    /**
     * @description: 计算周期
     * @param {object} row 行数据
     * @param {number} index 字段索引
     * @return {void}
     */
    handleComputePeriod(value, row, index) {
      if ((value ?? '') === '') {
        if (index > 0) {
          this.$message.warning('请输入正确的日期格式，如“2023-01-01')
        }
        return false
      } else {
        const { period, planStartTime, planEndTime } = row
        // 长度不在有三个(取消周期)
        const length = [period, planStartTime, planEndTime].filter((el) => el ?? '' !== '').length
        // 时间周期值个等于2
        if (length === 2) {
          // 修改周期
          if (index === 0) {
            if ((period ?? '') !== '') {
              if ((planStartTime ?? '') !== '') {
                // 计算计划完成时间(三期:计划完成时间 = 计划开始时间 + (周期 - 1))
                row.planEndTime = this.formatDate(planStartTime)
                  .clone()
                  .add(period - 1, 'days')
              } else {
                // 计算计划开始时间(三期:计划开始时间 = 计划完成时间 - (周期 - 1))
                row.planStartTime = this.formatDate(planEndTime)
                  .clone()
                  .subtract(period + 1, 'days')
              }
            }
          }
          // 修改计划开始时间
          if (index === 1) {
            if ((planStartTime ?? '') !== '') {
              if ((planEndTime ?? '') !== '') {
                // 计算周期(三期:周期=(计划完成时间-计划开始时间) + 1)
                row.period = this.formatDate(planEndTime).diff(this.formatDate(planStartTime), 'days') + 1 || void 0
              } else {
                // 计算计划完成时间(三期:计划完成时间 = 计划开始时间 + (周期 - 1))
                row.planEndTime = this.formatDate(planStartTime)
                  .clone()
                  .add(period - 1, 'days')
              }
            }
          }
          // 修改计划完成时间
          if (index === 2) {
            if ((planEndTime ?? '') !== '') {
              if ((planStartTime ?? '') !== '') {
                if (this.moment(planEndTime) < this.moment(row.planStartTime).startOf('day')) {
                  this.$message.warning('计划完成时间不能早于计划开始时间')
                } else {
                  // 计算周期(三期:周期=(计划完成时间-计划开始时间) + 1)
                  row.period = this.formatDate(planEndTime).diff(this.formatDate(planStartTime), 'days') + 1 || void 0
                }
              } else {
                // 计算计划开始时间(三期:计划开始时间 = 计划完成时间 - (周期 - 1))
                row.planStartTime = this.formatDate(planEndTime)
                  .clone()
                  .subtract(period - 1, 'days')
              }
            }
          }
        }
        // 时间周期值个等于3
        if (length === 3) {
          // 修改周期或者修改计划开始时间
          if (index === 0 || index === 1) {
            // 计算计划完成时间(三期:计划完成时间 = 计划开始时间 + (周期 - 1))
            row.planEndTime = this.formatDate(planStartTime)
              .clone()
              .add(period - 1, 'days')
          }
          // 修改计划完成时间
          if (index === 2) {
            // 计算周期(三期:周期=(计划完成时间-计划开始时间) + 1)
            row.period = this.formatDate(planEndTime).diff(this.formatDate(planStartTime), 'days') + 1 || void 0
          }
        }
        // 结合open、openChange解决时间选择器不能在输入后自动关闭的问题
        if (index === 1 || index === 2 || index === 3 || index === 4) {
          row.planStartTimeOpen = false
          row.planEndTimeOpen = false
          row.contractStartDateOpen = false
          row.contractEndDateOpen = false
        }
      }
    },
    /**
     * @description: 设置前置任务
     * @return {void}
     */
    handlePredecessorTask() {
      const timer = setTimeout(() => {
        this.predecessorTaskVisible = true
        clearTimeout(timer)
      })
    },
    /**
     * @description: 选择第一责任人
     * @param {object} row 当前行数据
     * @return {void}
     */
    handleFirstResNameSelect(row) {
      this.firstResNameData.row = row
      this.firstResNameVisible = true
    },
    /**
     * @description: 选择第一责任人回调
     * @param {object} value 选中项数据
     * @return {void}
     */
    handleFirstResName(value, row) {
      this.firstResNameData.row.firstResId = value.jobsSelectedId
      this.firstResNameData.row.firstResName = value.jobsSelectedName
      this.firstResNameVisible = false
    },
    /**
     * @description: 直接责任人下拉展开收起
     * @param {boolean} visible 下拉隐藏显示
     * @param {object} row 当前行数据
     * @return {void}
     */
    dropdownVisibleChange(visible, row) {
      if (!visible) {
        this.handleDirectResPerSelect(row, false)
      }
    },
    /**
     * @description: 直接责任人改变
     * @param {object} value 选中项
     * @param {object} row 行数据
     * @return {void}
     */
    handleDirectResPerList(value, row) {
      row.directResPerList = this.directlyDutyPersonList.filter(item=>value.map(el=>el.key).includes(item.employeeId)).map(el=>{
        return {
          key: el.employeeId,
          label: el.name
        }
      })
    },
    /**
     * @description: 直接责任人选择
     * @param {object} row 行数据
     * @return {void}
     */
    handleDirectResPerSelect(row, isShow) {
      this.$set(row, 'showSelect', isShow)
      if (row.showSelect) {
        this.$refs[`directSelect-${row.sortNum}`][0].$el.click()
      }
    },
    /**
     * @description: 完成标准带出验证资料
     * @param {string} value 完成标准值
     * @param {object} row 行数据
     * @return {void}
     */
    handleCompleteStandard(value, row) {
      const index = this.completeStandardList.findIndex((el) => el === value)
      if (index >= 0) {
        row.verifyFiles = this.verifyFilesList[index]
      }
    },
    /**
     * @description: 操作行
     * @param {string} type 操作类型('edit','delete')
     * @return {void}
     */
    handleOperation(type) {
      const loop = (list, id) => {
        for (let i = 0; i < list.length; i++) {
          if (list[i].id === id) {
            list[i].operation = type
          } else {
            list[i].operation = ''
          }
          if (Array.isArray(list[i].childTree) && list[i].childTree.length > 0) {
            loop(list[i].childTree, id)
          }
        }
      }
      const list = this.$clone(this.tableData)
      loop(list, this.selectRow.id)
      this.tableData = list
      this.$set(this.selectRow, 'operation', type)
      this.useSetFront = false
      const timer = setTimeout(() => {
        const event = new Event('scroll', { bubbles: true, cancelable: false })
        document.querySelector('.el-table__body-wrapper').dispatchEvent(event)
        clearTimeout(timer)
      }, 100)
    },
    /**
     * @description: 确认
     * @param {object} row 行数据
     * @return {object} 校验通过与否
     */
    handleConfirm(row) {
      const valid = this.verify(row)
      if (valid.pass) {
        row.operation = ''
        this.selectRow.operation = ''
        this.useSetFront = true
        this.handleUpdate(row)
      } else {
        this.$message.warning(`${valid.dataIndex}不能为空`)
      }
    },
    /**
     * @description: 校验行
     * @param {object} row 行数据
     * @return {boolean} 是否通过{pass:true/false,dataIndex:''}
     */
    verify(row) {
      const keyList = this.dataIndex[row.nodeType]
      for (let i = 0; i < keyList.length; i++) {
        const node = row[keyList[i]] ?? ''
        if (node !== '') {
          if (Array.isArray(node)) {
            if (node.length <= 0) {
              return {
                pass: false,
                dataIndex: this.columns1.find((item) => item.dataIndex === keyList[i]).title
              }
            }
          }
        } else {
          const arr = ['contractStartDate','contractEndDate']
          if(arr.includes(keyList[i])){
            // if(row.isContractDurationNode && row.nodeStatus !== 2 && row.nodeStatus !== 4 && row.nodeStatus !== 5 && row.nodeStatus !== 6){
            // }
            if(row.isContractDurationNode){
              return {
                pass: false,
                dataIndex: this.columns1.find((item) => item.dataIndex === keyList[i]).title
              }
            }
          }else{
            return {
              pass: false,
              dataIndex: this.columns1.find((item) => item.dataIndex === keyList[i]).title
            }
          }
        }
      }
      return {
        pass: true,
        dataIndex: ''
      }
    },
    /**
     * @description: 确认调整
     * @param {object} row 行数据
     * @return {void}
     */
    handleAdjust(row) {
      const valid = this.verify(row)
      if (valid.pass) {
        row.operation = ''
        this.selectRow.operation = ''
        this.useSetFront = true
        this.handleUpdate(row)
      } else {
        this.$message.warning(`${valid.dataIndex}不能为空`)
      }
    },
    /**
     * @description: 编辑
     * @param {object} row 行数据
     * @return {void}
     */
    handleUpdate(row) {
      const fun = row.nodeType === 0 ? view.editWorkPack : view.editWork
      this.$emit('update:loading', true)
      fun(
        Object.fromEntries(
          ['id', 'firstResId', ...this.dataIndex[row.nodeType]].map((el) => {
            if (el === 'businessMatters' || el === 'phaseCategory') {
              return ['name', row[el]]
            } else if (el === 'parentId') {
              return ['workPackId', row[el]]
            } else if (el === 'planEndTime' || el === 'planStartTime' || el === 'contractStartDate' || el === 'contractEndDate') {
              return [el, this.formatDate(row[el], false)]
            } else if (el === 'firstResId') {
              return [el, this.firstResNameData.row.firstResId]
            } else {
              return [el, row[el]]
            }
          })
        )
      )
        .then(({ code }) => {
          if (code === 200) {
            this.$message.success('编辑成功')
            this.selectRow = {}
            row.operation = ''
            this.currentRowKey = ''
            this.loadData()
          }
        })
        .finally(() => {
          this.$emit('update:loading', false)
        })
    },
    /**
     * @description: 删除
     * @param {void}
     * @return {void}
     */
    handleRemove(row) {
      const vm = this
      if (this.selectRow.nodeType === 0) {
        // 删除阶段/类别
        this.$confirm({
          okText: '确定',
          cancelText: '取消',
          title: '确定删除阶段/类别?',
          onOk() {
            vm.$emit('update:loading', true)
            view
              .removeWorkPack({ selectedWorkPackId: vm.selectRow.id })
              .then(({ code }) => {
                if (code === 200) {
                  vm.$message.success('删除成功')
                  row.operation = ''
                  vm.selectRow.operation = ''
                  vm.useSetFront = true
                  vm.loadData()
                }
              })
              .finally(() => {
                vm.$emit('update:loading', false)
              })
          }
        })
      } else {
        // 删除业务事项
        this.$confirm({
          okText: '确定',
          cancelText: '取消',
          title: '确定删除业务事项?',
          onOk() {
            vm.$emit('update:loading', true)
            view
              .removeWork({ selectedWorkId: vm.selectRow.id })
              .then(({ code }) => {
                if (code === 200) {
                  vm.$message.success('删除成功')
                  row.operation = ''
                  vm.selectRow.operation = ''
                  vm.useSetFront = true
                  vm.loadData()
                }
              })
              .finally(() => {
                vm.$emit('update:loading', false)
              })
          }
        })
      }
    },
    /**
     * @description: 取消操作
     * @param {object} row 行数据
     * @return {void}
     */
    handleCancel(row) {
      this.selectRow.operation = ''
      this.useSetFront = true
      for (let item in this.selectRow) {
        if (typeof this.selectRow[item] === 'object') {
          row[item] = this.selectRow[item] ? this.$clone(this.selectRow[item]) : null
        } else {
          row[item] = this.selectRow[item]
        }
      }
    },
    /**
     * @description: 历史调整信息
     * @param {object} row 行数据
     * @return {void}
     */
    handleHistory(row) {
      this.historyAdjustVisible = true
      this.historyAdjustData = row
    },
    /**
     * @description: 手动刷新
     * @return {void}
     */    
    handleRefresh(){
      this.selectRow = {}
      this.currentRowKey = ''
      this.loadData()
    },
    /**
     * @description: 是否合同节点改变
     * @param {boolean} val 是否合同节点
     * @param {object} row 行数据
     * @return {void}
     */    
    isContractDurationNodeChange(val,row){
      if(val){
        row.contractStartDate = row.planStartTime
        row.contractEndDate = row.planEndTime
      }else{
        row.contractStartDate = ''
        row.contractEndDate = ''
      }
    }
  }
}
</script>
<style lang="less" scoped>
@deep: ~'>>>';
.btn-wrapper {
  margin: 0 -5px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  button {
    margin: 5px;
  }
}
.pub-table-select-count {
  margin-top: 5px;
  > span {
    margin-right: 12px;
  }
}
.sort-num {
  display: block;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  img {
    margin-right: 5px;
    width: 16px;
    height: 16px;
  }
}
.class-0 {
  // background-color: #d1d1d1;
  color: #606266;
}
.class-1 {
  color: #606266;
}
.class-2 {
  background-color: #f85c62;
}
.class-3 {
  background-color: #1dc682;
}
.class-4 {
  background-color: #ffced0;
}
.width-100 {
  width: 100%;
}
@{deep} .construction-schedule-view-table .el-table td .cell {
  overflow: visible;
}
.span-ellipsis {
  width: 100%;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
}
.span-btn-ellipsis {
  width: 100%;
  display: flex;
  justify-content: center;
}
.span-btn-ellipsis-text {
  width: calc(100% - 85px);
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
}
.span-btn-ellipsis-btn {
  width: 75px;
  margin-left: 10px;
}
</style>

